import React, { useEffect, useState } from 'react';
import { Route, Switch, useHistory } from 'react-router-dom';
import './App.scss';
import Home from '@/views/Home';
import NotFound from './components/NotFound';
import Task from './views/Task';
import Login from '@/views/Login';
import Register from '@/views/Register';

function App() {
  const [count, setCount] = useState(0);
  const history = useHistory();

  useEffect(() => {
    if (location.pathname === '/') {
      history.push('/dash');
    }
    window.gotoDash = () => {
      history.push('/dash');
    };
    window.routerGoto = (path: string) => {
      history.push(path);
    };
  }, []);

  return (
    <div className="container" onContextMenu={(e) => e.preventDefault()}>
      <Switch>
        <Route path="/dash" exact>
          <Home />
        </Route>
        <Route path="/login" exact>
          <Login />
        </Route>
        <Route path="/register" exact>
          <Register />
        </Route>
        <Route path="/task/:taskId">
          <Task />
        </Route>
        <Route path="*">
          <NotFound />
        </Route>
      </Switch>
    </div>
  );
}

export default App;
